html[data-theme="s_green"] {
  --headBg: #eff8f5;
  --contentBg: #f5f5f5;
  --text: #222222;
  --icon: #e3e9e6;
  --iconBg: #4c5651;
  --hoverBg: #cccccc74;
  --inputBg: #e0f1e8;
  --active: #cdeddc;
  --playBg: #07c160;
}

html[data-theme="s_blue"] {
  --headBg: #eef5fa;
  --contentBg: #f5f7fa;
  --text: #3e5b76;
  --icon: #e3e9e6;
  --iconBg: #4c5651;
  --hoverBg: #d9e2eab0;
  --inputBg: #dbf1fb;
  --active: #b8d2f3;
  --playBg: #22c5fd;
}

html[data-theme="s_pink"] {
  --headBg: #faf4f4;
  --contentBg: #faf7f6;
  --text: #630a27;
  --icon: #e3e9e6;
  --iconBg: #4c5651;
  --hoverBg: #ebdcdfbb;
  --inputBg: #faeef0;
  --active: #fbdee6;
  --playBg: #ff82ab;
}
html[data-theme="s_orange"] {
  --headBg: #faf5f3;
  --contentBg: #faf8f7;
  --text: #674b37;
  --icon: #e3e9e6;
  --iconBg: #4c5651;
  --hoverBg: #e5ddd9ba;
  --inputBg: #faeeea;
  --active: #fbdfd7;
  --playBg: #ff8265;
}
